import Order from '../pages/order'
import React, {Component} from 'react'
import {Route} from "react-router-dom";
import Head from '../components/head'
import Nav from '../components/nav'

class Main extends Component {
    constructor(props){
        super()
        this.state = {
            navStyle:{
                width:'270px',
                height:'calc(100vh - 60px)',
                borderRight:"1px solid #eeeeee",
                marginRight:'-1px',
                overflowX:'hidden',
                overflowY:'auto',
                position:'absolute',
                left:0,
                top:'60px'
            },
            mainStyle:{
                marginLeft:'270px',
                boxSizing:'border-box',
                padding:'12px',
                height:'calc(100vh - 60px)',
                overflowX:'hidden',
                overflowY:'auto'
            }
        }
    }
    render() {
        return (
            <div>
                <div className='head'>
                    <Head/>
                </div>
                <div className='nav' style={this.state.navStyle}>
                    <Nav/>
                </div>

                <div className='main' style={this.state.mainStyle}>
                    <Route  path='/main/order' component={Order}></Route>
                </div>
            </div>
        )
    }
}

export default Main
